<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>Cindy JS</title>
        <style>
            body {
                margin: 0;
                padding: 0;
            }
        </style>
        <script type="text/javascript" src="../build/js/Cindy.js"></script>
        <script type="text/javascript">
var cdy = CindyJS({
  scripts: "cs*",
  defaultAppearance: {},
  ports: [{
    id: "CSCanvas",
    width: 680,
    height: 336,
    background: "rgb(168,176,192)",
    transform: [{visibleRect: [-9.04, 9.32, 18.16, -4.12]}]
  }],
  geometry: [
    {name: "A", type: "Free", pos: [0, 0], drawtrace: true, tracedim: 1, tracelength: 200, traceskip: 1},
    {name: "B", type: "Free", pos: [1, 1], size: 8, color: [1, 1, 0]},
    {name: "c", type: "Through", args: ["B"], dir: [1, 0, 0]}
  ]
});
        </script>
    </head>
    <body>
        <div id="CSCanvas"></div>
    </body>
</html>
